/*
 * version：1.0.0
 * design:Tosn
 * Time:2017-6-22
 * message,modal,load实现
 * 
 */

(function(window,underfined){
	var xwPop = window['xwPop'] = {
		msginit:{
			type:'info',   //success info warning error
			callBack:'', //回调函数
			showClose:false, //是否显示关闭按钮
			text:'提示的文字内容', //内容
			duration:3000, //显示的时间
			fadeTime:500 //渐隐 渐入的时间
		},
		modalinit:{
			title:'提示',
			type:'alert', //text alert confirm
			callBack:'', //确定回调
			returnCallBack:'', //取消回调 confirm下才有
			text: '提示的文字内容',
			btn:{ //按钮文字
				yes: '确定',
				no: '取消'
			},
			autoClose:true, //点击确定取消执行function后 是否关闭当前弹窗
			fadeTime:500, //渐隐 渐显的时间
			width:420,
		},
		loadinit:{
			text:'载入中...',
			color:"#fff",
			bgColor:"#fff"
		}
	}
	xwPop.msg = msg;
	xwPop.msgOut = msgOut;
	xwPop.modal = modal;
	xwPop.load = load;
	xwPop.loadRemove = loadRemove;
	
	function msg(o){
		var msgElement=document.createElement("div");
		msgElement.setAttribute("class",'xw-pop-msgbox');
		var messageBody = [],msgTimeout;
		var _o = $.extend({},xwPop.msginit,o);
		var _icon='';
		switch(_o.type){
			case 'success':
				_icon = "<img src=\"\">";
				break;
			case 'warning':
				_icon = "<img src=\"\">";
				break;
			case 'error':
				_icon = "<img src=\"\">";
				break;
			default:
				_icon = "<img src=\"\">";
				break;
		}
		
		$(msgElement).addClass("xw-pop-msgbox-"+_o.type+"");
		messageBody[messageBody.length] = "<div class=\"xw-pop-msgbox-icon\">";
		messageBody[messageBody.length] = _icon;
		messageBody[messageBody.length] = "</div><div class=\"xw-pop-msgbox-text\"><p>"+_o.text+"</p></div>";
		if(_o.showClose){
			messageBody[messageBody.length] = "<div class=\"xw-pop-msgclose\"><span title=\"关闭\">×</span></div>"
		}
		msgElement.innerHTML = messageBody.join("")
		$("body").append($(msgElement));
		$(msgElement).animate({
			top:'20px',
			opacity:'1'
		},_o.fadeTime,function(){
			if(_o.duration != 0){
				msgTimeout = setTimeout(function(){
					msgOut($(msgElement),_o.fadeTime,_o.callBack);
				},_o.duration);
			}
		})
		$(".xw-pop-msgclose span").bind("click",function(){
			clearTimeout(msgTimeout)
			var $parents = $(this).parents(".xw-pop-msgbox");
			msgOut($parents,_o.fadeTime,_o.callBack)
		})
	}
	function msgOut(el,fadeTime,callBack){
		el.animate({
			top:"-80px",
			opacity:"0"
		},fadeTime,function(){
			el.remove();
			if(typeof(callBack) == 'function'){
				callBack();
			}
		});
	}
	
	function modal(o){
		var modalBox = document.createElement("div"),modalBody=[],_o = $.extend({},xwPop.modalinit,o);
		modalBox.setAttribute("class",'xw-pop-modalbox');
		modalBody[modalBody.length] = "<div class=\"xw-pop-modal-section\" style=\"width:"+_o.width+"px\">";
		modalBody[modalBody.length] = "<div class=\"xw-pop-modal-header\">"+_o.title+"<span class=\"xw-pop-modal-close\" title=\"关闭\">×</span></div>";
		modalBody[modalBody.length] = "<div class=\"xw-pop-modal-body xw-pop-modal-body-"+_o.type+"\">"+_o.text+"</div>";
		modalBody[modalBody.length] = "<div class=\"xw-pop-modal-btn\">";
		if(_o.type == 'confirm'){
			modalBody[modalBody.length] = "<a class=\"xw-pop-modal-btn-no\">"+_o.btn.no+"</a>";
		}
		modalBody[modalBody.length] = "<a class=\"xw-pop-modal-btn-yes\">"+_o.btn.yes+"</a>";
		modalBody[modalBody.length] = "</div></div>";
		modalBox.innerHTML = modalBody.join("");
		$("body").append($(modalBox));
		$(modalBox).animate({
			opacity:'1'
		},_o.fadeTime);
		
		//点击确定
		$(".xw-pop-modal-btn-yes").bind("click",function(){
			if(typeof(_o.callBack) == 'function'){
				_o.callBack();
			}
			if(!_o.autoClose){
				return false;
			}
			$(modalBox).fadeOut(_o.fadeTime,function(){
				$(modalBox).remove();
			})
		});
		
		//点击取消
		$(".xw-pop-modal-btn-no").bind("click",function(){
			if(typeof(_o.returnCallBack) == 'function'){
				_o.returnCallBack();
			}
			if(!_o.autoClose){
				return false;
			}
			$(modalBox).fadeOut(_o.fadeTime,function(){
				$(modalBox).remove();
			})
		});
		
		//点击关闭
		$(".xw-pop-modal-close,.xw-pop-modalbox").bind("click",function(){
			$(modalBox).fadeOut(_o.fadeTime,function(){
				$(modalBox).remove();
			});
		});
		
		//阻止冒泡
		$(".xw-pop-modal-section").bind("click",function(event){
			event.stopPropagation();
		});
	}
	
	function load(o){
		var _o=$.extend({},xwPop.loadinit,o),loadBody=[];
		console.log(_o)
		var loadElement = document.createElement("div");
		loadElement.setAttribute("class","xw-pop-loadbox");
		loadBody[loadBody.length]="<div class=\"xs-pop-loading-section\"><div class=\"xw-pop-loading\"><span style=background:"+_o.bgColor+"></span><span style=background:"+_o.bgColor+"></span></span><span style=background:"+_o.bgColor+"></span></span><span style=background:"+_o.bgColor+"></span></span><span style=background:"+_o.bgColor+"></span></span></div>";
		loadBody[loadBody.length]="<div class=\"xw-pop-loading-text\" style=color:"+_o.color+">"+_o.text+"</div></div>"
		loadElement.innerHTML = loadBody.join("");
		$("body").append($(loadElement))
	}
	
	function loadRemove(){
		$(".xw-pop-loadbox").remove();
	}
	
	var xw = window['xw'] = { //为了简化使用对象
		info:function(txt,fn){
			xwPop.msg({
				text:txt,
				callBack:fn
			})
		},
		warn:function(txt,fn){
			xwPop.msg({
				text:txt,
				type:'warning',
				callBack:fn
			})
		},
		success:function(txt,fn){
			xwPop.msg({
				text:txt,
				type:'success',
				callBack:fn
			})
		},
		error:function(txt,fn){
			xwPop.msg({
				text:txt,
				type:'error',
				callBack:fn
			})
		},
		alert:function(txt,fn){
			xwPop.modal({
				text:txt,
				callBack:fn
			})
		},
		confirm:function(txt,fn,refn){
			xwPop.modal({
				text:txt,
				type:'confirm',
				callBack:fn,
				returnCallBack:refn
			})
		},
		load:function(txt){
			xwPop.load({
				text:txt
			})
		},
		loadRemove:function(){
			xwPop.loadRemove();
		},
	}
})(window)
